<template>
  <ul class="icons">
    <li v-for="(item,index) in iconsList" :key="index">
        <img :src="item.imgUrl" alt="">
        <span>{{item.title}}</span>
    </li>
  </ul>
</template>

<script>
export default {
    props:{
        iconsList:Array
    },
    // data(){
        // return{
        //     iconsList:[
        //         {
        //             id:1,
        //             title:'自饮茶',
        //             imgUrl:'./images/cha.png'
        //         },
        //         {
        //             id:2,
        //             title:'茶礼盒',
        //             imgUrl:'./images/chahu.png'
        //         },
        //         {
        //             id:3,
        //             title:'茶具',
        //             imgUrl:'./images/cha1.png'
        //         },
		// 		{
		// 		    id:4,
		// 		    title:'领福利',
		// 		    imgUrl:'./images/liwuhuodong.png'
		// 		},
        //         {
        //             id:5,
        //             title:'官方验证',
        //             imgUrl:'./images/wode.png'
        //         },
                
                
        //     ]
        // }
    // }
}
</script>

<style scoped>
.icons{
    display: flex;
    justify-content: space-around;
    padding: 0.625rem 0;
}
.icons li{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.icons img{
    width: 2.375rem;
    height: 2.375rem;

}
.icons span{
    padding: 0.375rem 0;
    font-size: 0.875rem;
}
</style>